import 'package:base_flutter/base_flutter.dart';
import 'package:flutter/material.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:ls_work/res/colors.dart';

import '../../res/gaps.dart';
import '../../viewmodel/entry_record/entry_record_home_view_model.dart';
import '../../widgets/common_widget.dart';

class EntryRecordHomePage extends BaseStatefulMvvmWidget {
  @override
  State<StatefulWidget> createState() => _EntryRecordHomeState();
}

class _EntryRecordHomeState
    extends BaseMvvmListState<EntryRecordListViewModel, EntryRecordHomePage> {
  GlobalKey<ScaffoldState> key = GlobalKey();

  @override
  Widget buildRootView(BuildContext context, Widget loadingContentWidget) {
    return Scaffold(
      key: key,
      backgroundColor: Colours.bg_color,
      appBar: AppBar(
        title: Text('出入记录'),
        actions: [
          IconButton(
              onPressed: () {
                key.currentState?.openEndDrawer();
              },
              icon: Icon(Icons.manage_search_sharp))
        ],
      ),
      body: loadingContentWidget,
      endDrawer: endDraw(),
    );
  }

  Widget endDraw() {
    return Column(
      children: [
        AppBar(
          leading: Container(),
          actions: [Container()],
          title: Text('筛选'),
        ),
        Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
          SizedBox(
            height: 12,
          ),
          CommonText('姓名'),
          SizedBox(
            height: 8,
          ),
          NoBorderInput(
                  hintText: '输入来访人姓名',
                  text: vm?.searchName ?? "",
                  maxLines: 1,
                  textInputAction: TextInputAction.search,
                  onChanged: (str) {
                    viewModel.searchName = str;
                  },
                  onSubmitted: (str) {
                    viewModel.requestRefresh();
                  })
              .addToContainer(
                  decoration: BoxDecoration(
                      color: Colours.bg_color, borderRadius: 6.borderRadius),
                  padding: EdgeInsets.symmetric(horizontal: 10, vertical: 5)),

          SizedBox(
            height: 12,
          ),
          CommonText('进出类型'),
          SizedBox(
            height: 8,
          ),
          CommonText(viewModel.accessType?.pickName,hintText: '请选择').addToContainer(
            width: double.infinity,
              decoration: BoxDecoration(
                  color: Colours.bg_color, borderRadius: 6.borderRadius),
              padding: EdgeInsets.symmetric(horizontal: 10, vertical: 5)).onTap((){
                viewModel.chooseAccessType();
          }),

          SizedBox(
            height: 12,
          ),
          CommonText('客户类型'),
          SizedBox(
            height: 8,
          ),
          CommonText(viewModel.accessHumanType?.nameCn,hintText: '请选择').addToContainer(
              width: double.infinity,
              decoration: BoxDecoration(
                  color: Colours.bg_color, borderRadius: 6.borderRadius),
              padding: EdgeInsets.symmetric(horizontal: 10, vertical: 5)).onTap((){
            viewModel.chooseClientType();
          }),

          SizedBox(
            height: 12,
          ),
          CommonText('设备'),
          SizedBox(
            height: 8,
          ),
          CommonText(viewModel.equipment?.pickName,hintText: '请选择').addToContainer(
              width: double.infinity,
              decoration: BoxDecoration(
                  color: Colours.bg_color, borderRadius: 6.borderRadius),
              padding: EdgeInsets.symmetric(horizontal: 10, vertical: 5)).onTap((){
            viewModel.chooseEquipment();
          }),


          SizedBox(
            height: 12,
          ),
          CommonText('门点'),
          SizedBox(
            height: 8,
          ),
          CommonText(viewModel.gatePoint?.pickName,hintText: '请选择').addToContainer(
              width: double.infinity,
              decoration: BoxDecoration(
                  color: Colours.bg_color, borderRadius: 6.borderRadius),
              padding: EdgeInsets.symmetric(horizontal: 10, vertical: 5)).onTap((){
            viewModel.chooseGatePoint();
          }),


          SizedBox(
            height: 12,
          ),
          CommonText('开始日期'),
          SizedBox(
            height: 8,
          ),
          CommonText(viewModel.startDateStr,hintText: '请选择').addToContainer(
              width: double.infinity,
              decoration: BoxDecoration(
                  color: Colours.bg_color, borderRadius: 6.borderRadius),
              padding: EdgeInsets.symmetric(horizontal: 10, vertical: 5)).onTap((){
            viewModel.selectStartDate(click: (date){
              viewModel.requestRefresh();
            });
          }),

          SizedBox(
            height: 12,
          ),
          CommonText('结束日期'),
          SizedBox(
            height: 8,
          ),
          CommonText(viewModel.endDateStr,hintText: '请选择').addToContainer(
              width: double.infinity,
              decoration: BoxDecoration(
                  color: Colours.bg_color, borderRadius: 6.borderRadius),
              padding: EdgeInsets.symmetric(horizontal: 10, vertical: 5)).onTap((){
            viewModel.selectEndDate(click: (date){
              viewModel.requestRefresh();
            });
          }),

        ]).addToContainer(padding: EdgeInsets.symmetric(horizontal: 16)),
        SizedBox().setWeight(1),
        Gaps.dividerLine,
        SizedBox(
          height: 10,
        ),
        Row(
          children: [
            SizedBox(
              width: 16,
            ),
            TextButton(
              onPressed: () {
                key.currentState?.closeEndDrawer();
                viewModel.resetClick();
              },
              child: CommonText('重置', textColor: Colors.blue),
              style: ButtonStyle(
                  shape: WidgetStateProperty.all(RoundedRectangleBorder(
                      borderRadius: BorderRadius.horizontal(left: 20.radius),
                      side: BorderSide(color: Colors.blue)))),
            ).setWeight(1),
            TextButton(
                onPressed: () {
                  key.currentState?.closeEndDrawer();
                  viewModel.requestRefresh();
                },
                child: CommonText('确定', textColor: Colors.white),
                style: ButtonStyle(
                    backgroundColor: WidgetStateProperty.all(Colors.blue),
                    shape: WidgetStateProperty.all(RoundedRectangleBorder(
                      borderRadius: BorderRadius.horizontal(right: 20.radius),
                      side: BorderSide(color: Colors.blue),
                    )))).setWeight(1),
            SizedBox(
              width: 16,
            ),
          ],
        ),
        SizedBox(
          height: 12,
        )
      ],
    ).addToContainer(
        width: MediaQuery.of(context).size.width * 0.7,
        decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.horizontal(left: 12.radius)));
  }

  @override
  EntryRecordListViewModel createViewModel() {
    return EntryRecordListViewModel(context);
  }

  @override
  Widget createItemWidget(int index) {
    var item = viewModel.listItems[index];
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Row(
          crossAxisAlignment: CrossAxisAlignment.end,
          children: [
            CommonText(item.accessHumanName,
                textSize: 17, fontWeight: FontWeight.bold),
            SizedBox(
              width: 10,
            ),
            CommonText(item.accessHumanTypeName, textColor: Colors.blue),
            SizedBox().setWeight(1),
            CommonText(item.accessTypeName,
                textColor: item.accessType == '0' ? Colors.green : Colors.red,
                fontWeight: FontWeight.bold),
          ],
        ),
        CommonText('登记时间：${item.createdDate}'),
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            CommonText('方式：${item.identificationTypeName}'),
            CommonText(
                '体温：${item.temperature.isNullOrEmpty() ? "-" : '${item.temperature}℃'}'),
          ],
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            CommonText('设备：${item.iotName ?? ""}'),
            CommonText('门点：${item.gatePointName ?? ""}'),
          ],
        )
      ].insertWidget(SizedBox(
        height: 8,
      )),
    ).addToContainer(
        decoration:
            BoxDecoration(color: Colors.white, borderRadius: 10.borderRadius),
        padding: EdgeInsets.symmetric(horizontal: 10, vertical: 12));
  }

  @override
  Widget get separatorDivider => SizedBox(
        height: 12,
      );

  @override
  EdgeInsets get listPadding =>
      EdgeInsets.symmetric(horizontal: 16, vertical: 12);

  @override
  bool get canPullUp => true;
}
